Composer

Netscape Composerは、Netscape Communicatorの豊富なWorld Wide Web機能に、強力なWhat-You-See-Is-What-You-Get(WYSIWYG)ドキュメント作成機能を統合したものです。Composerを利用することにより、Communicatorの電子メール、スレッド表示されたディスカッショングループ、ファイル転送などの優れた機能に加え、ウェブページ、電子メール、ニュース記事の作成が、カットアンドペーストやドラッグアンドドロップなどの簡単な操作で実現できるようになります。

Netscape Composerのドキュメント作成機能は、オンラインドキュメントの編集や出版のための簡単かつ強力なソリューションを提供し、コンテンツ作成のエキスパートや初心者を問わずどなたにでも利用していただけるように設計されています。WYSIWYG編集により、はじめてお使いになる方でも、ダイナミックなオンラインドキュメントを簡単に作成することができ、また作成したドキュメントをローカルのファイルシステムやリモートのサーバに手軽に出版することができます。

Composerでは、以下のようにさまざまなことができます。

• WYSIWYG環境での作業。入力しながら段落やフォントタグなどの整形結果を見ることができます。
• テキストの追加、削除、変更。ダウンロードしたウェブページの任意の部分をクリックし、そのテキストや画像をすぐに編集できます。
• ドラッグアンドドロップ。ブックマークウィンドウ、メールウィンドウ、ニュースウィンドウ、ブラウザウィンドウからComposer内のドキュメントへ、ハイパーリンクや画像をドラッグすることができます(Windows版とMac OS版のみ)。また、Windowsのファイルマネージャー(Windows 95ではエクスプローラ)からComposerウィンドウへ、HTMLファイルや画像ファイルをドラッグすることもできます。
• インターネット上でのドキュメント出版。ページの出版は簡単で、ローカルのハードディスクからリモートのディレクトリやサーバへ、ファイルをボタン一つでコピーするだけです。
• テキストへの書式設定。お使いのワードプロセッサと同じように、テキストに対して段落や文字のスタイルを設定できます。
• フォント、フォントサイズ、色の変更。フォントに関する各種の設定ができますので、ポイントとなる部分を狙い通りに注目してもらえるようなページを作成することができます。
• ページへのオブジェクトの挿入。作成するウェブドキュメントには、表、画像、横罫線、ハイパーリンクなどを挿入できます。

Composerを使ってみましょう

• 新しいドキュメントを作成する
• 表示しているページを編集する
• すでにあるページを編集する

新しいページを作成する

• ファイルメニューから、新規を選び、空白ページを選択するか、または、コンポーネントバーのComposerボタン(鉛筆のアイコン)をクリックします。何も入っていない状態のComposerウィンドウが開きますので、新しいページを作成します。元のブラウザウィンドウは、開いたままComposerウィンドウの裏側に表示されます。
• ファイルメニューから、新規を選び、テンプレートからページを作成を選択します。ダイアログボックスが表示されますので、テンプレートとして使用するリモートファイルやローカルファイルを選択するか、またはネットスケープテンプレートウェブサイトにあるテンプレートファイルからテンプレートを選択します。テンプレートを選択した後は、ファイルメニューからページを編集を選択し、テンプレートを利用して新しいページを作成します。
• ファイルメニューから、新規を選択し、次にウィザードでページを作成を選択します。ページウィザードがNavigatorウィンドウに開きます。 ウィザードは、ネットスケープホームサイトにある特別なページで、ウェブページの作り方を順を追って案内します。ウィザードの手順に従って作業を進めていくだけで、Composerで開くことができるページができあがり、お客様の技術に応じてさらに編集を続けることができます。

参照

表示しているページを編集する

• ファイルメニューから、ページを編集、またはフレームを編集を選択します。現在使われているNavigatorウィンドウが、表示されていたドキュメントのComposerウィンドウになります。場所アイコンをドラッグし、コンポーネントバーにドロップすることもできます。

すでにあるページを編集する

1. Composerでファイルメニューからページを開くを選択します。

編集するページのファイル名、またはURLを入力するダイアログボックスが表示されます。
2. ファイルを選択してComposerをクリックし、次に開くをクリックします。
3. 選択したファイルの内容が表示されているComposerウィンドウが開きます。

ツールバーとポップアップメニュー

構成ツールバー

これらのボタンは、ウェブページの作成、編集、保存、リモートサーバへのファイル出版(アップロード)、ブラウザでのウェブページ表示、一般的な編集処理、リンクやターゲットの作成、画像や横罫線や表の挿入、スペルチェックの際に利用することができます。

書式ツールバー

これらのボタンは、段落書式の設定、フォントやフォントサイズやフォントスタイルの設定、文字列の色設定、文字列の配置を設定する際に利用することができます。

各ツールバーの左側にあるタブをクリックすることで、ツールバーのボタンを隠したり表示したりすることができます。ツールバーの表示非表示を切り替える場合は、表示メニューから各ツールバーに対応するメニュー項目を選択します。

ポップアップメニュー

ポップアップメニューは、使用頻度の高いコマンドを簡単に選択できるように用意されているもので、オブジェクト(文字列やリンクなど)を選択し、マウスを右クリックする(Mac OSの場合は、マウスのボタンを押したままにする)ことで表示されます。利用できるコマンドは、右クリックした時に何が選択されているかによります。例えば、リンクを選択している場合は、ポップアップメニューの項目として、リンクをコピーしたり、リンクのプロパティを変更したりするコマンドが表示されます。

ドラッグアンドドロップ操作

Composerでは、以下のようにさまざまなドラッグアンドドロップ操作が可能です(Windows、およびMAC OSの場合のみ)。

• 編集中のドキュメントにリンクを挿入するには、リンクをNavigatorウィンドウからComposerウィンドウにドラッグします。
• ファイルへのリンクを作るには、HTMLファイルをWindowsファイルマネージャー(Windows 95ではエクスプローラ)からComposerウィンドウにドラッグします。
• ブックマーク、メール、ニュースウィンドウからリンクをComposerウィンドウにドラッグすることができます。
• ウェブページに画像を加える最も簡単な方法として、画像をNavigatorウィンドウからComposerウィンドウにドラッグすることができます。
• 作業中のドキュメントに画像を挿入するには、画像ファイル(.GIF、.JPG、または.BMP)をデスクトップからComposerウィンドウにドラッグします。参考Composerは、BMPファイルをJPEG形式に変換します。

ウェブページ

はじめてのウェブページを作成する

概要

1. ファイルメニューから、新規を選び、空白ページを選択します。
2. Composerウィンドウで文字を入力します。
3. ファイルメニューの(上書き)保存を選択するか、または保存ボタンをクリックし、ファイルに名前を付けます。

詳細

1. ファイルメニューの新規から、空白ページを選択するか、または構成ツールバーの新しいページボタンをクリックします。

Composerウィンドウが空のページで表示され、ツールバーが一番上に表示されます。
2. ファイルメニューの(上書き)保存を選択(または、構成ツールバーの保存ボタンをクリック)します。

ファイル名を入力するダイアログボックスが表示されます。
3. ファイルを保存するには、例えばfirstpg.htmのようにファイル名を付けてOKをクリックします。(Mac OSのように)長いファイル名をサポートするオペレーティングシステムをご利用の場合は、ファイルの拡張子として.HTMLを使うことができます。

作成したページをブラウザで見る

1. ファイルから上書き保存を選択します。まだ名前等を付けていない場合は、ページのタイトルと名前を付けます。
2. ページをブラウザで表示を選択し、Navigatorウィンドウで新しく作成したページを表示します。Composerウィンドウは、新しいNavigatorウィンドウの裏側で開いたまま残ります。

基本的なテキストの編集

テキストを入力する

Composerは、通常のキーボードに付いているアンパサンド(&)やパーセント(%)のような文字もすべてサポートします。著作権(コピーライト)を示す記号などを挿入するには、まずWindows文字コード表アプリケーション(charmap.exe)を実行(Mac OSではキー配列プログラム)します。次に、フォントをTimes Romanに変更し、挿入する記号をコピーしてComposerウィンドウに貼り付けます。
参考: 編集メニューから元に戻すを選択することで、直前に実行したコマンドの処理を取り消すことができます(ただし元に戻すことができない処理もあります)。直前に実行した処理を再度実行するには、編集メニューからやり直しを選択します。

テキストを選択する

• 単語を選択するには、その単語上でダブルクリックします。
• 行全体を選択するには、その行の先頭をクリックします。
• 段落を選択するには、その段落が始まる行の先頭でダブルクリックします。

ヒント: 表示メニューから段落マークを表示を選択すると、ドキュメント中の段落マークの位置を確認できます。 段落マークは黒い長方形で表示されます。また、短い横罫線はページの終りを示します。

切り取り、コピー、貼り付け

ドキュメントからテキストを削除するには、そのテキストを選択し、編集メニューから切り取りを選択します。

ヒント: Windowsでは、選択したテキスト上で右クリックをすることで、切り取り、コピー、貼り付けをすばやく行うことができます。

参考: Composerウィンドウとは異なり、Navigatorウィンドウから切り取ったりコピーしたりしたテキストの場合、書式に関する情報(フォントやフォントスタイルなど)は引き継がれません。しかし、書式が設定されているテキストをコピーするために、ページを一時的に編集することはいつでもできます。

文字列を検索する

概要

1. 編集メニューからページ内を検索を選択します。
2. 検索する文字列を入力します。
3. 必要に応じて、検索オプションを指定し、検索をクリックします。

詳細

1. 編集メニューから、ページ内を検索を選択します。検索ダイアログボックスが表示されます。
2. 検索する文字列(Mac OSでは検索)テキストボックスに検索する文字を入力します。
3. 次の検索オプションを選択します。

• 大文字と小文字を区別する: アルファベットの大文字と小文字を区別して検索するかどうかを指定します。これを選択していると、Composerが、大文字小文字の違いも含めて正確に一致するテキストを検索します。選択していない場合は、大文字と小文字は区別されません。
• 上へまたは下へ: ファイルの上に向かって検索するか、下に向かって検索するかを指定します。Mac OSの場合は、上へ向かって検索を選択するとファイルの上に向かって検索が行われ、折り返して検索を選択すると検索開始位置にかかわらずファイル全体に対して検索が行われます。

スペルチェック

概要

• 構成ツールバーのスペルチェックボタンをクリックします。
• または、ツールメニューから、スペルチェックを選択します。

詳細

1. 次のいずれかを行います。
• ツールバーのスペルチェックボタンをクリックします。
• ツールメニューのスペルチェックを選択します。
スペルチェックダイアログボックスが表示されます。
2. 検出された単語ごとに、修正するか、無視するか、辞書に追加するかを選択します。
3. ドキュメントに戻るには、停止ボタンをクリックします。

スペルチェックダイアログボックス

• 単語テキストボックスには、スペルミスとして検出された単語が表示されます。このボックス内に直接入力することで単語を修正し、置き換えまたはすべて置き換えをクリックすると、修正がドキュメントに反映されます。
• 候補一覧には、使用中の辞書にある単語の中から、スペルミスの修正候補が選ばれて表示されます。
• 言語ドロップダウンリストでは、スペルチェックに使用する辞書を選択できます。選択されている辞書内の単語を修正したり新たに単語を追加したりする場合は、辞書を編集をクリックします。
• 置き換えをクリックすると、単語ボックス内のスペルミスとして検出された単語を、候補一覧で選択した単語に置き換えます。また、単語テキストボックスに直接修正を入力し、置き換えをクリックする方法で置き換えることもできます。
• すべて置き換えをクリックすると、現在スペルミスとして検出されている単語と同じ綴りの単語すべてに対して、候補一覧で選択された単語、または単語ボックスで直接入力により修正された単語への置き換えが行われます。
• チェックをクリックすると、選択されている辞書を使用して、単語テキストボックス内の単語に対するスペルチェックを行います。
• 無視をクリックすると、スペルミスとして検出された単語を、修正せずにドキュメント内にそのまま残します。
• すべて無視をクリックすると、現在スペルミスとして検出されている単語と同じ綴りの単語すべてを、修正せずにドキュメント内にそのまま残します。
• 学習をクリックすると、単語テキストボックス内の単語を辞書に追加するとともに、スペルミスとして検出された単語を置き換えます。参考: 単語テキストボックスに複数の単語がある場合は、それぞれが辞書に追加されます。
• 辞書を編集をクリックすると、辞書に対して単語の追加、置き換え、削除を行うダイアログボックスが表示されます
• 停止をクリックすると、ダイアログボックスを閉じてスペルチェックを終了します。

辞書を編集ダイアログボックス

• 新しい単語テキストボックスに単語を入力して追加をクリックすると、新しい単語が辞書に追加されます。
• 単語一覧で単語を選択し、新しい単語テキストボックスで入力による修正を加えて置き換えをクリックすると、一覧で選択した単語が新しい単語に置き換わります。
• 単語一覧で単語を選択し、削除をクリックすると、その単語が辞書から削除されます。

Composerのスタイルと書式

概要

スタイルの整形

• 段落書式: 段落の配置や見出しを設定できます。選択されているテキストが含まれている段落全体に影響します。
• 文字書式: フォントの種類、スタイル、サイズ、色などを設定できます。

段落書式

概要

• テキストを選択し、書式ツールバーの段落書式や配置のボタンをクリックします。
• または、テキストを選択し、書式メニューから段落を選び、段落スタイルを選択します。
• または、Windowsの場合、テキストを選択し、右クリックでポップアップメニューから段落/箇条書きのプロパティを選択します。

詳細

見出し
アドレス
箇条書き
整形済み
説明書きの表題
説明書きのテキスト

見出し1-6

見出しの例

見出し 1

見出し 2

見出し 3

見出し 4

見出し 5

見出し 6

アドレス

Carlos Goldstein@netscape.com

箇条書き

箇条書きのスタイルは、各段落のはじめに数字や行頭文字を付けた形式にテキストを整形します。Composerには、以下の箇条書きスタイルがあります。

番号なし: 段落の先頭に小さな黒丸やその他の記号が付きます。
番号付き: 段落の先頭に数字や順番を示す文字が付きます。
ディレクトリ: DOSのディレクトリ一覧のように、短い項目を横に並べるような場合に利用します。
メニュー: 行頭に文字などを付けずに短い項目を表示する場合に利用します。
説明書き: 定義一覧やグロッサリ一覧とも呼ばれ、段落にはインデントが付きます。定義を記述する際によく利用されます。

ヒント: Windows 95の場合は、段落内の任意の位置でマウスを右クリックすることにより、ポップアップメニューから段落/箇条書きのプロパティを選択し、文字のプロパティダイアログボックスを表示することができます。

整形済み

ほとんどのブラウザでは、余分なスペース、タブ、改行が削除されます。しかし、このスタイルで整形されたテキストは、スペースがスペースとして表示されます。従って、以下の例のように、コード、表、メールメッセージなど、固定ピッチフォント(等幅フォント)で表示させたい場合に役立ちます。

alert("Hello!");

説明書きの表題

説明書きの表題は、グロッサリや定義の一覧などのように、左側に短い項目を配置し、次の段落に右にインデントされた長いテキストを配置するような場合の項目部分に利用します。通常は、次の例のように、説明書きのテキストとの組み合わせで使われます。

説明書きのテキスト

説明書きのテキストは、グロッサリやその他一覧などで、単に説明部分として、または左側に短い項目を配置し、次の段落に右にインデントされた長いテキストを配置するような場合の説明部分に利用します。例えば、

段落のプロパティダイアログボックス

• 段落スタイルドロップダウンリストでは、段落スタイルを選択します。
• 追加のスタイルをクリックすると、選択した段落スタイルに対する追加の属性を表示します。箇条書きを選択して追加のスタイルを表示し、次のボックスで箇条書き、または行頭文字のスタイルを選択し、ドキュメント内での箇条書きの種類を指定します。引用文属性はどの段落書式にも使用できます。
• 箇条書きボックスでは、使用する箇条書きの種類を選択し、次に、番号なし、番号付き、ディレクトリ、メニュー、説明書きのいずれかを選択します。
• 番号/行頭文字のスタイル: 番号付きを選択した場合は、1,2,3やA,B,Cなどのような順番を表す記号を指定します。番号なしを選択した場合は、行頭文字(四角、黒丸、白丸)を指定します。
• 開始番号: テキストボックスに数値を入力し、箇条書きの開始番号を指定します。
• 配置: ページの左、右、中央のどこに配置するかを指定します。

文字書式

概要

• テキストを選択し、書式ツールバーの文字書式ボタンをクリックします。
• または、テキストを選択し、書式メニューからスタイルを選択します。
• または、テキストを選択し、書式メニューから文字のプロパティを選択します。

• 太字
• 斜体
• 等幅(固定ピッチ)
• ^上付き
• _下付き
• 点滅
• 下線
• 改行なし

詳細

1. テキストを選択します。
2. 以下のうち一つ選択します。
• 書式メニューから、スタイルを選び、書式を選択します。
• または、書式ツールバーから、文字書式ボタンを選択します。
• または、テキストを選択して書式メニューから文字のプロパティを選択し、文字のプロパティダイアログボックスを表示して、フォントの種類、色、サイズやその他の文字書式を指定します。

• 書式ツールバーのすべてのスタイルを削除ボタンをクリックします。
• または、書式メニューから、スタイルの設定をクリアを選択します。
• または、書式メニューから、文字のプロパティを選択し、文字のプロパティダイアログボックスのすべての設定をクリアボタンをクリックします

テキストに色を付ける

1. 色を変更するテキストを選択し、書式ツールバーにあるフォントの色ボタンをクリックします。Windows版では、選択したテキスト上でマウスを右クリックして文字のプロパティダイアログボックスを表示させてから、色を選択します。
2. 色の設定ダイアログボックスで色を選択し、変更する色を決めます。ページの配色とプロパティダイアログボックスの配色と背景パネルで、標準のテキストの色を指定できます。

文字のプロパティダイアログボックス

• フォントをクリックすると、使用するフォントを選択するか、またはプロポーショナルフォント、固定ピッチフォント(等幅フォント)のいずれかを選択し、他の人のブラウザで指定されているフォントでページが表示されるように設定できます。選択されている文字列が複数のフォントスタイルを含んでいる場合は、変更しないを選択します。
• フォントサイズをクリックすると、指定したフォントのサイズを選択できます。ここで表示されたフォントサイズは、Composerの設定パネルにあるフォントサイズモードでの設定に反映します。このモード設定を変更する場合は、編集メニューから設定を選び、カテゴリでComposerを選択します。
• 色チェックボックスをクリックし、次に色ボタンをクリックすると、選択した文字列に設定する色を指定できます。標準の色として既に用意されている色の中から選択することも、他の色をクリックしてユーザ定義の色を指定することもできます。選択した文字列が複数の色を含んでいる場合は、変更しないを選択します。

参考: 書式メニューのページの配色とプロパティを選択すると表示される配色と背景パネルでは、各種文字列の色に対する標準設定ができます。
• スタイル: 選択した文字列に設定する、斜体、太字、下線、改行なしなどのスタイルを指定できます。この中には、文字列を点滅させる点滅という特別なスタイルもあります。
• 他の色をクリックすると、ダイアログボックスが表示され、ユーザ定義の色を指定することができます。
• スタイルを削除をクリックすると、スタイルの中で選択されているチェックボックスがすべて選択されていない状態に戻ります。
• すべての設定を削除をクリックすると、このダイアログボックスで設定変更した内容がすべて未選択状態、あるいは空欄に戻ります。

Composerのフォント

Composerでは、ご使用のコンピュータシステムに組み込まれているフォントだけでなく、異なるプラットフォーム(例えば、Mac OS、Windows、UNIXシステムなど)間で有効なフォントを使用してページを作成することができます。また、読者がページを表示する際のフォントを指定することもできます。文字列にフォントを指定すると、"フォントを指定する"HTMLタグ(プロポーショナルフォントと固定ピッチ(等幅)フォントを除く)が挿入されます。

クロスプラットフォームフォント

Composerでは、異なるオペレーティングシステム間で適宜に類似フォントを割り当てる、三種類のフォントを利用できます。例えば、Arial(Windowsの標準フォント)を使用してページを作成した場合、Mac OSやUNIXシステム上では、自動的に類似フォントであるHelveticaで表示されます。

以下のは、それぞれのフォントと各オペレーティングシステムの対応表です。

ブラウザのフォント表示

Composerでは、自分(または読者)のブラウザで指定されているフォント設定のみを使用してページを作成することができます。この機能を利用するには、プロポーショナルフォント、および固定ピッチ(等幅)フォントとして使うフォント名を指定する必要があります。Navigatorでディスプレイフォントを設定するには、設定ダイアログボックスにある表示/フォントパネルで、プロポーショナルフォント、および固定ピッチ(等幅)フォント欄にフォン名を指定します。例えば、プロポーショナルフォントとしてTimes New Romanを指定し、Composerでフォント設定にプロポーショナルフォントを選択してページを作成すると、Navigatorでは、そのページがTimes New Romanで表示されます。同様に、Composerでフォント設定に固定ピッチ(等幅)を使って文字列を入力すると、Navigatorでは、固定ピッチ(等幅)フォントとして指定されているフォントで表示されることになります。

参考: 読者は常にページ作者が行った設定を変更し、標準設定のページ表示に別のフォントを選択できることを覚えておく必要があります。

フォントを選択する

概要

• 書式ツールバーのフォントボタンをクリックします｡
• 書式メニューからフォントを選択し、使用するフォントを選びます。
• 書式メニューから文字のプロパティを選択し、文字のプロパティダイアログボックスでフォントを選びます。

詳細

ご使用のシステムに組み込まれているフォントに加え、Navigatorが固定ピッチフォント、およびプロポーショナルフォントとして表示するフォントを利用できます。設定ダイアログボックスの表示/フォントパネル(編集メニューから設定を選び、カテゴリで表示/フォントを選択します)で、プロポーショナルフォント、および固定ピッチ(等幅)フォントとして使用するフォント名を指定します。

文字列にフォントを設定するには、

1. まず、フォントを設定する文字列を選択するか、またはこれから設定するフォントで入力を始めるページ内の位置にカーソルを置きます。
2. フォントを設定するには、
• 書式ツールバーのフォントボタンをクリックします。
• または、書式メニューからフォントを選択します。
• または、書式メニューから文字のプロパティを選択し、文字のプロパティダイアログボックスを表示します。
3. プロポーショナル、固定ピッチのいずれかを選択するか、または一覧から特定のフォント名を選択します。

フォントサイズを選択する

概要

1. Composerの設定ダイアログボックスで、フォントサイズモードを選択します。
2. Composerウィンドウで、フォントサイズを選択します。

詳細

Composerは、Composerの設定ダイアログボックスの全般パネルでフォントサイズモードに指定されている設定に基づいて、利用できるフォントサイズの選択肢を表示します。フォントサイズモードは、相対的なHTMLサイズ、絶対的なポイントサイズ、または両方の中から自分に合ったものを選択できます。

フォントサイズの表示モードは三つの中から選択できます。フォントサイズモードを選ぶには、

1. 編集メニューから設定を選択し、カテゴリでComposerを選択します。

Composerの設定の全般パネルが表示されます。

2. フォントサイズモードで、表示するフォントサイズの種類を選択します(Windowsの場合のみ)。
• Navigatorのフォントサイズの設定に基づく絶対的なポイントサイズ(設定ダイアログボックスの表示/フォントで指定できます)。
• 相対的なHTMLフォントスケール(-2から+4)。
• 相対的なHTMLフォントスケール、および絶対的なポイントサイズの両方。

フォントサイズを設定するには、

1. フォントを設定する文字列を選択するか、またはこれから設定するフォントサイズで入力を始めるページ内の位置にカーソルを置きます。
2. フォントサイズを設定するには、
• 書式ツールバーのフォントサイズボタンをクリックします。
• または、書式メニューからフォントサイズを選択します。
• または、書式メニューから文字のプロパティを選択し、文字のプロパティダイアログボックスでフォントサイズを指定します。

参照

Composerの設定 - 全般

横罫線の挿入

横罫線を挿入するには、

1. Composerウィンドウ内で、横罫線を挿入する場所をクリックします。
2. 横罫線ボタン、または挿入メニューから横罫線を選択します。罫線上でダブルクリックし、ポップアップメニューから横罫線のプロパティを選択することで、配置、幅、高さの指定、そして3D表示をするかどうかを指定できます。

ヒント: ドキュメント内で、文字列以外のオブジェクトをダブルクリックすると、そのプロパティを変更することができます。

HTMLの基礎

厳密に言えば、Composerを使うためにHTMLを詳しく知る必要はありません。しかし、HTMLドキュメントが内部的にどうなっているのかを理解しておくと、ウェブページに関する作業中に何か疑問な点があった場合などにとても役立ちます。設定した事柄に対して正しい結果が得られないような場合も、そのページのHTMLファイル内でタグを見ることにより、問題点を発見できるかもしれません。
HTMLドキュメント内では、かぎ括弧<>で囲まれたプレーンASCIIテキストの命令タグを利用して、書式設定が行われています。書式設定には、通常、始まりのタグと終りのタグが対で使われます。例えば、ある行を見出しとして指定する場合は以下のように、見出しの文字列を、その書式の始まりを示すタグと終りを示すタグで囲みます。

<H3>Hello World Wide Web!</H3>

上の例の<H3>タグは、レベル3の見出し(見出し3)として扱われる文字列の始まりを示し、</H3>タグは、見出し3として扱われる文字列の終りを示しています。Composerでは、これらのタグが段落ツールバーのスタイル一覧や、書式メニューの段落からの選択により自動的に挿入されますので、ユーザ自身がタグを入力しなくてもすみます。

Composerの書式とHTMLタグの対応

HTMLを直接挿入する

既にHTMLについての知識を持っている場合は、Composerの書式メニューからの選択では自動的に挿入されないような特別なHTMLタグを、自分で挿入することができます。この機能は、HTMLのフォームタグ、Javaアプレット、Plug-Inコードをドキュメントに挿入する際に役立ちます。Composerでは、ここで挿入されたオブジェクトが表示されませんが、挿入が行われたことを示す特別なHTMLタグアイコンが表示されます。

タグアイコンの直接挿入や編集は、HTMLタグダイアログボックスで行い、結果のドキュメントをブラウザで表示することができます。

ヒント: タグアイコンをダブルクリックすると、HTMLタグダイアログボックスが表示され、HTML、Javaアプレット、Plug-Inコードをすばやく編集することができます。

HTMLタグを挿入するには、

1. 挿入メニューからHTMLタグを選択します。

ダイアログボックスが表示されたら、ドキュメント中の指定位置に挿入するHTMLを入力します。

2. HTMLを読みやすくするために、各行の最後でEnterを押します。
3. 確認をクリックし、Composerに入力したHTMLのタグが正しいかどうかを確認させます。

Composerは、左右のかぎ括弧< >と、引用符の対応を確認します。

HTMLタグダイアログボックス

HTMLタグダイアログボックスでは、Composerの書式メニューからの選択では挿入されないようなHTMLタグ(JavaScriptを含む)を、直接入力により挿入できます。確認をクリックすると、Composerが、左右のかぎ括弧< >と引用符が正しく対応しているかどうかを確認します。

参考: 一度に入力できるタグは一つだけです。例えば、

<applet code="HelloWorld.class" width=100 height=30>
<param name=text value="Hello World!">
</applet>

Composerでは、ここで挿入されたオブジェクトが表示されませんが、挿入が行われたことを示す特別なHTMLタグアイコンが表示されます。HTMLタグダイアログボックスでタグの挿入や編集を行ったら、そのドキュメントをブラウザで表示し確認することができます。

追加のHTMLタグダイアログボックス

表やリンクを作成している際に、追加のHTMLタグダイアログボックスを利用して、作業中の<TABLE>や<HREF>タグに、HTMLの属性やJavaScriptを追加することができます。

表

表は、カレンダーのようにグリッド線(格子状の線)の中に情報を入れて表示したり、金融データのようにスプレッドシートの情報を表示する場合にとても便利です。また表を上手に利用すると、工夫次第でページ全体のレイアウトがさらに良くなります。例えば、レジュメや社報を作成するとき、表の中に画像を組み込むこともできます。また、ページ全体を表のようにして、その中にさらに表を作成(入れ子の表)したり、表の機能を駆使してさまざまなレイアウトを実現することも可能です。

概要

表

表を挿入する

行、列、セルを追加、削除する

表のプロパティを設定する

表を挿入する

概要

• 表を挿入するページでクリックします。
• 構成ツールバーの表を挿入ボタンをクリックするか、または挿入メニューから表を選択します。

詳細

1. ドキュメント内で表を挿入する位置にカーソルを置きます。
2. 挿入メニューから表を選択するか、または書式ツールバーの表を挿入ボタンをクリックします。
3. 新しい表のプロパティダイアログが表示されますので、必要な設定を行います。
4. OKボタンをクリックし、変更を確定してダイアログボックスを閉じます。または、まず適用ボタンをクリックして変更後の内容をプレビューし、次に閉じるボタンをクリックし、変更を確定してダイアログボックスを閉じます。

新しい表のプロパティダイアログボックス

• 行数ボックスには、表の行数を入力します。挿入メニューから表を選び、行を選択することで行を追加することができます。
• 列数ボックスには、表の列数を入力します。挿入メニューから表を選び、列を選択することで列を追加することができます。
• 表の配置で左、中央、または右をクリックすると、ドキュメント内で表を左揃えにするか、中央揃えにするか、右揃えにするかを選択できます。
• 表題をいれるをクリックすると、表題の文字列用に中央揃えの領域が確保されます。この場合、表の上、または表の下をクリックし、表題の位置を選択します。
• 枠線の幅ボックスには、セルの周りの枠線サイズ(ピクセル)を入力します。この値が0の場合、枠線は表示されません。参考: Composerでは、枠線の幅が0の表をComposerウィンドウ内でのみ点の枠線で表示します。Navigatorでは表示されません。
• セルの間隔ボックスには、セル間(線と線の間)の空白部分の値(ピクセル)を入力します。
• セルの余白ボックスには、各セル内の余白の値(ピクセル)を入力します。これは、各セルでの上下左右の余白になります。
• 表の幅ボックスには、表の幅の値を入力し、さらにピクセル、または%(ウィンドウに対して)を選択します。表の幅は、ウィンドウに対する割合でも、ピクセル数でも指定できます。表の幅をウィンドウに対する割合で指定した場合、ウィンドウの幅を変更すると、表の幅も変わります。
• 表の高さの最小値ボックスには、表の高さの最小値を入力し、さらにピクセル、または%(ウィンドウに対して)を選択します。これは、表の高さとして取り得る値の最小値です。入力文字列が長い場合は、表に入りきらなくなることがないように、文字列の長さに合わせて表の大きさが自動的に変わります。表の高さは、ウィンドウに対する割合でも、またはピクセル数でも指定できます。表の高さをウィンドウに対する割合で指定した場合、ウィンドウの高さを変更すると、表の高さも変わります。
• 列の幅を同じにするをクリックすると、Composerが各セルの幅を自動的に均等に設定します。各セルごとに自分でサイズを設定する場合、この項目を選択する必要はありません。
• 色をクリックすると、表の背景に使用する色を設定できます。色を指定するには、ボタンをクリックし、パレットから色を選択します。また、用意されているパレットに無い色を使う場合は、他の色をクリックし、自分で作った色を指定することもできます。
• 画像をクリックすると、表の背景として使用する画像を設定できます。この場合、使用する画像の場所とファイル名を入力します。画像を選択をクリックすると、ファイルの場所を見ながら設定することができます。
• 元の場所に画像を残すをクリックすると、画像ファイルをコピーせずに、作業中のドキュメントと同じディレクトリ内に残します。参考: このオプションが選択できない(灰色で表示されている)場合は、既にComposerの設定ダイアログボックスの出版パネルでこの項目が設定されています。
• 追加のHTMLをクリックすると、他のHTMLやJavaScriptをTABLEタグに追加するためのダイアログボックスが表示されます。

表を選択、削除する

• 表の選択: 表内でクリックし、編集メニューから表を選択を選択します｡選択した表は、切り取りやコピーを利用して、ドキュメント内の任意の場所に貼り付けできます。
• 表の削除: 表内をクリックし、編集メニューから表を削除を選択します。

行、列、セルを追加、削除する

• 行、列、セルの追加: まず、表内の挿入位置でクリックします。次に、挿入メニューから表を選択し、行、列、セルを選択します。
• 行、列、セルの削除: まず、削除する行、列、セルをクリックします。次に、編集メニューから表を削除を選択し、行、列、セルをクリックします。

表のプロパティを設定する

参考: 表のプロパティダイアログボックスでの設定は、 最初に表を作成したときの設定に常に上書きされます。

表のプロパティを設定するには、

1. 表内をクリックします。
2. 書式メニューから表のプロパティ(Mac OSでは書式|表)を選択し、さらに表のタブを選択します。
3. 表のプロパティダイアログボックスが表示されますので、プロパティを設定します。

表のプロパティダイアログボックス

• 表の配置で左、中央、または右をクリックすると、ドキュメント内で表を左揃えにるか、中央揃えにするか、右揃えにするかを選択できます。
• 表題をいれるをクリックすると、表題の文字列用に中央揃えの領域が確保されます。この場合、表の上、または表の下をクリックし表題の位置を選択します。
• 枠線の幅ボックスには、セルの周りの枠線サイズ(ピクセル)を入力します。この値が0の場合、枠線は表示されません。参考: Composerでは、枠線の幅が0の表をComposerウィンドウ内でのみ点の枠線で表示します。Navigatorでは表示されません。
• セルの間隔ボックスには、セル間(線と線の間)の空白部分の値(ピクセル)を入力します。
• セルの余白ボックスには、各セル内の余白の値(ピクセル)を入力します。これは、各セルでの上下左右の余白になります。
• 表の幅ボックスには、表の幅の値を入力し、さらにピクセル、または%(ウィンドウに対して)を選択します。表の幅は、ウィンドウに対する割合でも、ピクセル数でも指定できます。表の幅をウィンドウに対する割合で指定した場合、ウィンドウの幅を変更すると、表の幅も変わります。
• 表の高さの最小値ボックスには、表の高さの最小値を入力し、さらにピクセル、または%(ウィンドウに対して)を選択します。これは、表の高さとして取り得る値の最小値です。入力文字列が長い場合は、表に入りきらなくなることがないように、文字列の長さに合わせて表の大きさが自動的に変わります。表の高さは、ウィンドウに対する割合でも、またはピクセル数でも指定できます。表の高さをウィンドウに対する割合で指定した場合、ウィンドウの高さを変更すると、表の高さも変わります。
• 列の幅を同じにするをクリックすると、Composerが各セルの幅を自動的に均等に設定します。各セルごとに自分でサイズを設定する場合、この項目を選択する必要はありません。
• 色をクリックすると、表の背景に使用する色を設定できます。色を指定するには、ボタンをクリックし、パレットから色を選択します。用意されているパレットに無い色を使う場合は、他の色をクリックし、自分で作った色を指定することもできます。
• 画像をクリックすると、表の背景として使用する画像を設定できます。この場合、使用する画像の場所とファイル名を入力します。画像を選択をクリックすると、ファイルの場所を見ながら設定することができます。
• 元の場所に画像を残すをクリックすると、画像ファイルをコピーせずに、作業中のドキュメントと同じディレクトリ内に残します。参考: このオプションが選択できない(灰色表示になっている)場合は、既にComposerの設定ダイアログボックスの出版パネルでこの項目が設定されています。
• 追加のHTMLをクリックすると、HTMLやJavaScriptをTABLEタグに追加できるダイアログボックスが表示されます。

行のプロパティを設定する

1. 設定を変更する行にカーソルを置きます。
2. 書式メニューから表のプロパティ(Mac OSでは書式|表)を選択し、行のタブを選択します。

行のプロパティダイアログボックスが表示されますので、縦や横のテキストの配置や、テキストの色などを設定します。
3. プロパティを設定します。
4. OKボタンをクリックし、変更を確定してダイアログボックスを閉じます。または、まず適用ボタンをクリックして変更後の内容をプレビューし、次に閉じるボタンをクリックし、変更を確定してダイアログボックスを閉じます。

行のプロパティダイアログボックス

• 横の配置では、選択した表の行で、セル内のテキストの上下左右に対する相対的な横位置を設定します。標準設定を選択すると、表が作成されたときの設定で配置されます。
• 縦の配置では、選択した表の行で、セル内のテキストの上下左右に対する相対的な縦位置を設定します。標準設定を選択すると、表が作成されたときの設定で配置されます。
• 色をクリックすると、表の背景に使用する色を設定できます。色を指定するには、ボタンをクリックし、パレットから色を選択します。また、用意されているパレットに無い色を使う場合は、他の色をクリックし、自分で作った色を指定することもできます。
• 画像をクリックすると、表の背景として使用する画像を設定できます。この場合、使用する画像の場所とファイル名を入力します。画像を選択をクリックすると、ファイルの場所を見ながら設定することができます。
• 元の場所に画像を残すをクリックすると、画像ファイルをコピーせずに、作業中のドキュメントと同じディレクトリ内に残します。参考: このオプションが選択できない(灰色で表示されている)場合は、既にComposerの設定ダイアログボックスの出版パネルでこの項目が設定されています。
• 追加のHTMLをクリックすると、他のHTMLやJavaScriptをTABLEタグに追加するためのダイアログボックスが表示されます。

---

セルのプロパティを設定する

セルのプロパティを設定するには、
1. 設定を変更するセルにカーソルを置きます。
2. 書式メニュー(Mac OSでは書式|表)から表のプロパティを選択し、セルのタブを選択します。

セルのプロパティパネルが表示されますので、追加する行と列の範囲、縦と横のテキストの配置、テキストのスタイルと折り返し、セルの幅と高さ、セルの色などを設定します。
3. プロパティを設定します。
4. OKボタンをクリックし、変更を確定してダイアログボックスを閉じます。または、まず適用ボタンをクリックして変更後の内容をプレビューし、次に閉じるボタンをクリックし、変更を確定してダイアログボックスを閉じます。
参考: 表の中にさらに表を挿入すると(入れ子の表)、親のセル(入れ子の表が入っている親の表のセル)に対する、入れ子の表の高さの最小値や幅の割合を指定することができます。親の表の高さや幅を変更すると、入れ子の表の高さや幅も変わります。この設定をするには、ボックスに数値を入力し、%(セルに対して)を指定します。

---

セルのプロパティダイアログボックス

セルのプロパティダイアログボックスでは、選択したセルに対して、縦横のテキストの配置、テキストのスタイルと折り返し、セルの幅や高さ、セルの色などの属性を指定します。OKボタンをクリックすると、変更が確定されダイアログボックスが閉じます。また、確定前に変更後の内容をプレビューするには、まず適用ボタンをクリックし、次に閉じるボタンをクリックし、変更を確定してダイアログボックスを閉じます。
• 横の配置では、選択した表のセルで、セル内のテキストの上下左右に対する相対的な横位置を設定します。標準設定を選択すると、表が作成されたときの設定で配置されます。
• 縦の配置では、 選択した表のセルで、セル内のテキストの上下左右に対する相対的な縦位置を設定します。標準設定を設定すると、表が作成されたときの設定で配置されます。
• セルの範囲 ボックスでは、選択したセルの範囲を複数行、または複数列に増やすかどうかを設定できます。列数を増やす場合は、列のテキストボックスに数値を入力します。また、行数を増やす場合は、行のテキストボックスに数値を入力します。
• 見出しをクリックすると、テキストを選択したセル内の中央に配置し、スタイルを太字にします。
• 改行なしをクリックすると、テキストが次の行に折り返さないように設定することができます。この場合、改行マークが挿入されている個所でのみ、テキストが次の行に折り返します。
• セルの幅をクリックすると、選択したセルの幅を指定できます。セルの幅は、表に対する割合でも、ピクセル数でも指定できます。セルの幅を表に対する割合で指定した場合、表の幅を変更すると、セルの幅も変わります。この指定をするには、ボックスに数値を入力し、ピクセル、または%(表に対して)を選択します。
• セルの高さの最小値をクリックすると、選択したセルの高さの最小値を指定できます。これは、選択したセルの高さとして取り得る値の最小値です。入力文字列が長い場合は、セルに入りきらなくなることがないように、文字列の長さに合わせてセルの大きさが自動的に変わります。セルの高さは、表に対する割合でも、ピクセル数でも指定できます。セルの高さを表に対する割合で指定した場合、表の高さを変更するとセルの高さも変わります。この指定をするには、ボックスに数値を入力し、ピクセルまたは%(表に対して)を選択します。
• 色をクリックすると、セルの背景に使用する色を設定できます。色を指定するには、ボタンをクリックし、パレットから色を選択します。用意されているパレットに無い色を使う場合は、他の色をクリックし、自分で作った色を指定することもできます。
• 画像をクリックすると、セルの背景として使用する画像を設定できます。この場合、使用する画像の場所とファイル名を入力します。画像を選択をクリックすると、ファイルの場所を見ながら設定することができます。
• 元の場所に画像を残すをクリックすると、画像ファイルをコピーせずに、作業中のドキュメントと同じディレクトリ内に残します。参考: このオプションが選択できない(灰色で表示されている)場合は、既にComposerの設定ダイアログボックスの出版パネルでこの項目が設定されています。
• 追加のHTML をクリックすると、HTMLやJavaScriptをTABLEタグに追加できるダイアログボックスが表示されます。

---

画像

画像を表示させる方法は二つあります。最も一般的なのは、インライン画像で、この場合、画像がウェブページの一部として表示されます。もう一つは個別の外部リンクで、この場合、ウェブページとは別にダウンロードする必要があります。画像は、実際には別の画像ファイルで、HTMLドキュメント内に"直接含まれている"わけではありません。ウェブページに表示される画像は、ローカルディスク上、またはリモートコンピュータ上にある画像ファイルです。

現在使われているほとんどのウェブブラウザは、次の二つの画像フォーマットをサポートしており、Compoerでは、その両方をサポートしています。

• GIF (CompuServe Graphics Interchange Format .GIF 拡張子)
• JPEG (Joint Photographic Experts Group .JPG 拡張子)
GIFファイルは、JPEGファイルより画質が落ちますが、ダウンロード用に最適化されていてサイズも小さいため、一般的に高速です。Composerでは、ビットマップ画像ファイル(.bmp)をJPEG形式に変換してドキュメントに挿入することも可能です(Windowsの場合のみ)。

画像は、自分で描くこともできますが、市場に出回っているクリップアートのパッケージを購入したり、ネット上にある数々の画像アーカイブから入手することもできます。ウェブページに画像を使用する場合は、自分で描いたものを使用するか、画像の作者から許可を得るか、または著作権フリーのクリップアートを使用するなどして、著作権を侵害しないようにしなければなりません。

Composerには、本来表示させる画像の代わりに、代わりの表示をさせる機能があります。代わりの表示には、代わりの文字列と、低解像度用の画像(代わりの画像)があります。代わりの文字列は、本来画像が表示される位置に、画像の代わりとして表示される文字列です。テキストのみのブラウザを使用している訪問者のためにも、代わりの文字列を用意しておくことをお勧めします。また、Navigatorやその他のブラウザでは、マウスカーソルが画像の上にある場合も、この文字列が表示されます。

低解像度用の画像は、本来表示されるべき主画像の代わりに表示される画像です。これは、主画像が読み込まれている間に主画像に先立って表示されます。

ヒント: 画像をドキュメントに挿入する簡単な方法は、クリップボードからのカットアンドペーストや、画像を編集しているページへのドラッグです。

ヒント: アニメーションGIFファイルが含まれているドキュメントを編集している場合、Escを押すとファイルの継続的な読み込みが中止され、ドキュメントの編集が可能になります。

概要

画像の挿入

---

画像を挿入する

ウェブページに画像を挿入するには、親ドキュメント(編集しているウェブページ)と同じディレクトリか、またはComposerの設定で指定したディレクトリのどちらかに画像ファイルをコピーしておく必要があります。一度画像を挿入した後は、選択して各コーナーのハンドルをドラッグすることでサイズを変えることができます。

ヒント: 画像をドキュメントに簡単に挿入するには、クリップボードからのカットアンドペーストや、画像を編集しているページへのドラッグを利用します。

画像を挿入するには、

1. カーソル位置をドキュメント内の画像を挿入する位置に置きます。
2. 挿入|画像を選択するか、構成ツールバーの画像ボタンをクリックします。画像のプロパティダイアログが表示され、このダイアログで、挿入する画像ファイル、テキストに対する画像の配置、画像の周りの空白などを指定することができます。
3. ドキュメントに挿入する画像ファイルの名前とパスを入力します。ファイル名や場所がわからない場合は、参照をクリックしてディレクトリ一覧から画像ファイルを選択します。


重要 : 画像ファイルを指定した場所から移動すると、その画像がウェブページでは表示されなくなってしまいます。

4. 低解像度用の画像の名前を入力します。 この画像は高解像度画像よりも先に読み込まれ表示されます。ファイル名やパスがわからない場合は、参照をクリックしてディレクトリの一覧から画像ファイルを選択します。(オプション)
5. 指定した画像ファイルの位置に代わりに表示する文字列を入力します。Lynxのようなテキスト専用のウェブブラウザを使用している訪問者や、画像を表示しないように指定している訪問者のために、この文字列を入力しておくことをお勧めします。この代わりの文字列が指定されていない場合、訪問者は意味の無い代用の画像を見るはめになり、情報を伝えることができる文字列を見ることができません。(オプション)

---




画像のプロパティダイアログボックス

画像のプロパティダイアログボックスの項目を使用して、新しい画像を挿入したり、テキストの折り返し、高さや幅、空白といった既存の画像のプロパティを変更したりします。

• 画像の場所テキストボックスでは、ドキュメントに挿入する画像、またはプロパティを変更する画像のファイル名や場所を入力します。ComposerはGIFとJPGの画像ファイルフォーマットをサポートしています。ファイル名や場所が分からない場合は、ファイルの選択 をクリックしてディレクトリの一覧から画像ファイルを選択してください。
• 元の場所に画像を残す をクリックすると、画像ファイルのコピーをせずに、現在作業中のドキュメントと同じディレクトリに置いておくことができます。参考: このオプションが選択できない(灰色になっている)場合は、この項目が既にComposerの設定ダイアログボックスの出版パネルで設定されています。
• 代わりの文字列/低解像度用の画像をクリックすると、ダイアログボックスが表示され、元の画像の代わりにテキストまたは低解像度の画像を表示するかどうかを指定できます。
• 配置ボタンを押して、選択した画像のテキストなどに対する相対的な位置を示します。画像をページに対して右詰めまたは左詰めに指定することもできます。配置の変更結果を確認するには、ブラウザでページを見ます。
• 大きさテキストボックスでは、新しいまたは作業中の画像の高さと幅のピクセルサイズを設定します。
• 元のサイズをクリックするとすべてのサイズの変更が元に戻ります。
• 高さ/幅を固定をクリックすると、ドキュメント内で画像を移動する場合に、サイズの設定を維持します。
• 周りの空白ボックスでは、画像の左右上下の空白(テキストが表示されない部分)の幅を入力します。画像の周りの枠線とその幅をピクセルで指定できます。
• 画像マップを削除をクリックすると、画像からすべてのリンク領域が削除されます。画像マップは特別なタイプの画像で、1つの画像の中に複数ヶ所へのリンクが含まれます。


画像を編集をクリックすると、画像を編集するために、Composerの設定の全般パネルで指定した画像エディタが起動します。エディタを指定していない場合は、設定を促す表示があります。

---

代わりの画像のプロパティダイアログボックス

代わりの画像のプロパティダイアログボックスの項目を使用して、画像の代わりの文字列を加え、その位置に表示する低解像度の画像を指定します。

• 代わりの文字列テキストボックスには、 画像の位置に表示する文字列を入力します。たとえば、画像の表題や簡単な説明などです。
• 低解像度用の画像テキストボックスには、主画像を読み込んでいる間にまず表示する、低解像度用の画像の名前を入力します。ファイルを選択をクリックして一覧から画像ファイルを選択してください。


画像を編集をクリックすると、Composerの設定ダイアログの全般パネルで指定した外部画像で、エディタを使用し画像ファイルを編集できます。

---

画像変換ダイアログボックス

画像変換ダイアログボックスを使用して、ページにビットマップ画像ファイル(.bmp)をインポートします。ComposerによりファイルがJPEG (.jpg)フォーマットに変換され、高、中、低品質ピクセル表示からの選択ができます。

---

ページの配色とプロパティを設定する

ページの配色とプロパティパネルでは、作成者の情報、キーワード、ハイパーリンクの色、背景の画像や色などの、ドキュメントに関する全般的な情報とプロパティを設定します。またMETAタグに関する設定などもできます。

概要

ページの配色とプロパティの全般パネル
配色と背景パネル
METAタグパネル


---

ページの配色とプロパティの全般パネル

このパネルには作業中のドキュメントに関する情報が表示されます。また、ウェブユーザが特定のトピックを検索する際に役に立つ情報を追加することができます。OKボタンを押すと変更が適用され、ダイアログボックスが閉じます。適用ボタンをクリックすると変更が適用されます。その後、閉じるボタンをクリックして変更を確定し、ダイアログボックスを閉じます。

場所

作業中のドキュメントのローカルディスク上の場所です。

表題

ドキュメントがブラウズされた際にウィンドウのタイトルに表示される文字列です。ほとんどのウェブ検索ツールは表題を使ってウェブページを特定していますので、訪問者が簡単にそのページを見つけることができるように、ページの内容を的確に伝えられるような表題を付けることをおすすめします。

作成者

作業中のドキュメントを作成した人の名前です。この情報は、ウェブ検索ツールを使って一覧から選択する際に役立ちます。

説明

ドキュメント内容の短い説明です。この情報も特定のトピックを検索する人に役立ちます。

その他の属性

ウェブ上で他のユーザから簡単にドキュメントを見つけてもらえるように、Yahooのような検索サービスで利用されるキーワードを入力します。キーワードにはドキュメント内容に最も適しているカタログ名(カタログサーバから得られます)を入力します。種類名は検索サービスでドキュメントを特定するために用いられるものです。

---

配色と背景パネル

リンクの文字やドキュメントの背景色について、ブラウザの配色を利用するか、ユーザー定義で指定した配色を利用するかを、作業中のドキュメントを対象に設定します。OKボタンを押すと変更が適用され、ダイアログボックスが閉じます。適用ボタンをクリックすると変更が適用されます。その後、閉じるボタンをクリックして変更を確定し、ダイアログボックスを閉じます。

ユーザ定義...

テキストやリンクの文字の色、ドキュメントの背景(標準設定)を設定することができ、ドキュメントに保存されます。

ブラウザの配色..

作業中のドキュメントに対して、全般の設定パネルでのブラウザ表示の配色設定を使用します。ユーザは標準のブラウザ表示に使用する色を設定できるので、この設定はどの色が使われているかによります。

配色

一覧から配色を選択します。

ユーザ定義

標準、リンク、アクティブなリンク、訪れたリンクに対して、各文字の色を指定できます。ボタンをクリックしてカラーパレットを表示し、好きな色を選択してください。右側に指定した色でサンプルのテキストが表示されます。

背景

作業中のドキュメントの背景色を選択します。色の指定をクリックして色の設定ダイアログを表示し、背景の色を選択してください。

画像を使用

背景として画像を使用するには、このボックスをチェックして画像ファイル名を入力してください。ファイル名や場所が分からない場合は、参照をクリックしてディレクトリの一覧から画像ファイルを選択してください。

参考: 背景画像は全体に表示され、背景の色の設定よりも優先されます。

---

METAタグパネル

このパネルはお使いのオンラインサービスプロバイダがドキュメントに入れるように推奨しているオプション情報を表示します。この情報は実際に編集したりブラウズしたりする際に表示されることはなく、ソースHTMLに入っているだけです。詳細は、お使いのプロバイダにお問い合わせください。

---

Composerを設定する

Composerの設定の全般および出版パネルを使用して、外部のHTMLと画像のエディタ、フォントサイズ表示モード、出版場所とオプションの選択など、作成しているページすべての設定をすることができます。

編集メニューから、設定を選択し、Composerカテゴリを選択します。

概要

Composerの設定 - 全般
Composerの設定 - 出版


---

Composerの設定 - 全般

Composerの設定の全般パネルでは、ドキュメントに加える作者名を指定し、ページのHTMLソースの編集や画像ファイルの編集のために、どのアプリケーションを使用するかを指定できます。またComposerが自動的にドキュメントを保存するかどうかを選択し、編集中にフォントサイズをどう表示するか指定することができます。

作成者名

ドキュメントの作成者を示すためにComposerによって使われる名前を入力します。 この情報は、ウェブ検索ツールを使って一覧からドキュメントを見つけようとしている読者には大変役立つものとなります。

外部エディタ

お使いのテキストエディタと画像エディタのパスとファイル名を入力します。 たとえば、実際のHTMLソースを編集する際に、メモ帳を使う場合は、C:¥WINDOWS¥NOTEPAD.EXEと入力してください。編集メニューからHTMLソースを選択すると、作業中のドキュメントでメモ帳が起動します。ファイル名がわからない場合は、選択をクリックし、アプリケーションを探してください。

参考: 外部エディタを使用してHTMLソースを編集した場合、Composerで変更を見るためにはまずソースエディタで変更を保存してから表示メニューから再読み込みを選択します。

ページを___分ごとに自動的に保存する

このボックスをクリックすると、Composerに自動的にドキュメントを保存させることができます。次に、頻度を指定します(分単位)。

フォントサイズモード

Composerでどうフォントサイズを表示するかを選択します(Windowsの場合のみ)。
• Navigatorの標準フォントの絶対ポイントサイズ(設定ダイアログボックスの表示/フォントカテゴリで指定できます)。
• 相対HTMLフォントスケール(-2と+4の間)
• 相対HTMLフォントスケールおよび絶対ポイントサイズの両方
参照
フォントサイズを選択する

---

Composerの設定 - 出版

Composerの設定の出版パネルを使用して、リンクを維持したり、リモートの場所に、画像ファイルをコピーするといったリモートにドキュメントを保存するための設定を指定できます。ドキュメントを出版する標準のFTPあるいはHTTPサイトを示すこともできます。

リンクを維持する

挿入されるリンクは、作業中のドキュメントに対して相対的なリンクです。このオプションは、リモートサーバからローカルのディスクにドキュメントを保存、または出版する際に、ドキュメントと同じディレクトリ内にあるファイルへのリンクが対応することを保証します。このようなリンクは、指し示されているリモートファイルをローカルに保存した場合も有効です。ドキュメントのあるディレクトリの外にあるファイルへのリンクは、絶対リンクになります。このオプションをチェックしない際には、リンクのパス名は修正されず、保存されたドキュメントへのローカルリンクは動作しない可能性があります。

ページの画像を残す

画像を常に表示できるように、ドキュメントと同じ場所に画像ファイルをコピーします。画像はドキュメント自体には含まれていないため、このオプションを選択しない場合は、HTMLドキュメントだけが保存され、画像ファイルは保存されません。ドキュメント内の画像は常にドキュメントと同じディレクトリに置かれますので、このオプションを選択することをお勧めします。

出版先のFTPまたはHTTPサイトのアドレスを入力する

• FTP: File Transfer Protocol (FTP)を使用してウェブページをアップロードする標準の場所を入力します。このボックスに入力すべき場所については、お使いのインターネット サービスプロバイダにお問い合わせください。たとえば、お使いのサービスプロバイダがAmerica Onlineの場合は、このボックスのURLは次のようになります。 ftp://ftp.aol.com/docs/.
• HTTP: Web server protocol(HTTP)を使用してウェブページをアップロードする標準の場所を入力します。自分でウェブサーバを用意していない場合は、このボックスに入力すべき場所をお使いのインターネットサービスプロバイダにお問い合わせください。たとえば、このボックスのURＬは次のようになります。 http://websurf.com/docs/.

FTPサイトに出版する場合、ブラウザで表示する際のHTTPアドレスを入力する

出版するウェブページの標準の場所を入力します。たとえば、ウェブページを http://aol.com/docs/に出版している場合は、このURLをテキストボックスに入力してください。
参照
相対リンクと絶対リンク

---

ハイパーリンク

ハイパーリンクはドキュメントの能動的な部分といえます。ハイパーリンクをクリックすると、次のような所へリンクできます。
• 同じウェブページの一部分
• お使いのコンピュータ上のファイル
• インターネット上のコンピュータ
現在のコンピューティング界において、ハイパーテキストやハイパーリンクは珍しいものではありません。たとえば、MS WindowsやMacintosh、OS/2などのヘルプシステムがそうです。ヘルプには通常、クリックすると詳しい情報が得られる強調表示された部分が表示されます。この別の情報は、同じファイルにあっても、コンピュータ内の別のヘルプファイルにあってもよいのです。ウェブにおいてハイパーリンクは、お使いのコンピュータ上の情報にアクセスでき、潜在的にはインターネット上のどのコンピュータにもアクセスできます。アクセスする情報は、コンピュータのファイルとして格納されていて、お使いのコンピュータに文字や音声、絵画や動画までをももたらします。

概要

URL
リンクを作成する
画像をリンクする
ターゲットへリンクする
相対リンクと絶対リンク

---

URL

Uniform Resource LocatorsすなわちURLは、インターネット上にある情報の1つ1つのための番地です。ほとんどの場合、単に示したい情報をブラウザで表示して、その"素材"の長い文字列をリンクにコピーしたり貼り付けたりするだけで済み、URLを理解しようとする必要はありません。 しかし、URLが何であるのか、また、なぜそんなに長くて複雑なのかを理解することが時には役立ちます。ウェブで情報の出版を始める場合はなおさら、 ウェブページをどのようにして見つけることができるのかを他の人にも説明できるよう、URLについてもっと知りたくなるでしょう。

ほとんどのURLは、プロトコル、ホスト名、ディレクトリ、ファイル名の4つの部分で構成されています。例 :

http://mysystem.com/docs/index.html
• プロトコル(http:)は、ドキュメントがどのような方法でアクセスされるかを示します;つまり、ブラウザがファイルを入手する際に使用するプロトコルやプログラムの型です。もし、ブラウザがファイルを入手するためにHTTPを使用するならば、プロトコルの部分はhttpになります。ブラウザがFTPを使用するならば、ftpになります。
• ホスト名 (mysystem.com)は、home.netscape.comのような、情報が置かれているインターネット上のシステムです。 同じホスト名でもプロトコルが異なれば、異なったURLになります。例 :
http://mysystem.com ftp://mysystem.com gopher://mysystem.com
これは、3つの異なる情報サーバを備えた同じマシンです。3つすべてがシステムにインストールされていて利用可能なため、同じホスト名を持っていても問題はありません。
• ディレクトリ(/docs) ファイルやその他の形式で作られた情報のホスト上の場所です。ディレクトリは、実際のディレクトリとファイル名であったり、あるいは、プロトコルがその情報のある場所を参照するために使用するインジケータであったりします。
• ファイル名(index.html)は、ウェブページの .HTML ファイルです。

---

リンクを作成する

概要

1. リンクを作成するテキストや画像をクリックします。
2. 挿入メニューからリンクを選択するか、構成ツールバーの リンクボタンをクリックします。
3. リンク先のファイル名またはURLを入力します。

ヒント :ブラウザで表示しているページへのリンクを作成するには、Navigatorウィンドウから、場所ボックスの左にあるリンクアイコンをComposerウィンドウにドラッグします(Mac OS版とWindows版のみ)。

ローカルのドキュメントにリンクするということは、 お使いのコンピュータ上のドキュメントにリンクするということです。参照先のドキュメントが同じディレクトリにある必要はありません(しかし、同じディレクトリに置いた方が良いでしょう)。リモートのドキュメントにリンクするということは、 ローカルディスク上のドキュメントではなく、インターネット上のどこかにあるドキュメントにリンクすることを意味しています。

詳細

他のウィンドウからComposerウィンドウにリンクをドラッグすることで、 ドキュメントの中にリンクを作成することができます(Macintosh版とWindows版のみ)。たとえば、ブラウザ、ブックマーク、メール、ニュースウィンドウから リンクをComposerウィンドウのドキュメントにドラッグすることができます。リンクのプロパティダイアログを使ってリンクを作成することもできます。

1. リンクを作成するテキストや画像をクリックします。
2. 挿入メニューからリンクを選択するか、構成ツールバーの リンクボタンをクリックします。

リンクのソースは、リンクの作成に使用される 選択されたテキストを表示します。このテキストを変更するには、ドキュメントの中のテキストを選択して入力し直します。 ダイアログで変更の結果を見るには、ダイアログを開く前にテキストを選択します。

3. 選択したテキストにリンクする、ローカルファイル名またはリモートURLを入力します。ローカルファイルを選択するには、ファイルを参照をクリックします。
4. 作業中のドキュメント、または選択されたファイル("ターゲットを表示"オプションによります)の中にある名前付きターゲットを選択します。選択したテキストにリンクするターゲットを選択します。

ターゲットを表示オプションは、名前付きターゲットの表示を、作業中のドキュメントのターゲットにするか、リンク先のページやファイルボックスによって示されるファイルのターゲットにするかを指定します。

5. ダイアログボックスを開いたまま変更を反映させるには、適用をクリックします。変更を反映させてダイアログボックスを閉じるには、OKをクリックします。

参照

画像をリンクする

ターゲットへリンクする

---

リンクのプロパティダイアログボックス

リンクのプロパティダイアログボックスの項目を使用して、新しいリンクを挿入したり、既存のリンクのプロパティを変更したりします。OKボタンを押すと変更が適用され、ダイアログボックスが閉じます。適用ボタンをクリックすると変更が適用されます。その後、閉じるボタンをクリックして変更を確定し、ダイアログボックスを閉じます。

• リンクのソース テキストボックスには、リンクの作成に使用する文字列を入力します。既にリンク先のページに画像や文字列を選択している場合は、ここに表示されます。
• ページの場所やローカルファイルへのリンクテキストボックスには、選択した文字列のリンク先となるローカルのファイル名やリモートのURLを入力します。URLを入力するか、ファイルを参照をクリックしてファイルを選択してください。
• 名前付きターゲットを選択ボックスには、作業中のドキュメントや選択したファイル(ターゲットを表示オプションによります)中にある名前付きターゲットが表示されます。選択した文字列にリンクするターゲットを選択してください。
• ターゲットを表示の選択したファイルまたは作業中のファイルをクリックすると、名前付きターゲットとして、作業中のドキュメントから表示するか、ページへのリンクやファイルボックスで示されるローカルファイルから表示するかを指定します。
• リンクを削除をクリックすると、選択した文字列に設定されているリンクを解除します。選択範囲に2つ以上のリンクが含まれている場合は、警告ボックスが表示され、すべてのリンクを削除するかどうか確認します。
• 追加のHTML をクリックすると、HTMLやJavaScriptをリンクのタグに追加できるダイアログボックスが表示されます。

---

画像をリンクする

概要

1. 画像を挿入します。
2. 構成ツールバーのリンクボタンをクリックします。
3. リンクの場所を指定します。

詳細

テキストと同様に、ドキュメント中の画像にリンクを設定することができます。リンクが設定された画像をクリックすると、Navigatorウィンドウには画像のリンク先のページが表示されます。
1. ページに画像を挿入します。
2. 画像を選択して、構成ツールバーのリンクボタンをクリックします。

リンクのプロパティダイアログが表示されます。
3. リンク場所を指定します。

ファイルメニューのページをブラウザで表示を選択し、 画像をクリックしてリンク先のページを表示してみます。
ヒント Navigatorウィンドウからリンクされた画像をComposerウィンドウにドラッグすると、画像とリンク両方をコピーします。

参照

画像を挿入する

---

ターゲットへリンクする

単にドキュメント自体にリンクするのではなく、 ドキュメントのある特定の場所にリンクする場合は、ターゲット(HTMLでは、名前付きターゲットまたはアンカーとも呼ばれます)を作成します。ドキュメント中にターゲットを挿入しておき、そのターゲットを示すリンクを 同じドキュメント中に、または他のドキュメントに作成することで、特定の場所へのリンクを作成することができます。ブラウザでこのようなリンクをクリックすると、ブラウザはターゲットを含むドキュメントを開き、ターゲットの位置にスクロールします。
1. ターゲットを作成する行の始まりにカーソルを置くか、またはその行の始まりのテキストを選択します。
2. 挿入メニューからターゲットを選択するか、または構成ツールバーのターゲットボタンをクリックします。
3. 編集ボックスにターゲットの名前を入力します(最大30文字まで)。 この名前はリンクのプロパティダイアログのターゲットの一覧に表示されます。ステップ1.で、テキストを選択している場合は、 このテキストボックスには標準のターゲット名が表示されます。
4. OKをクリックすると、リンクされる位置を示すターゲットアイコンがドキュメントに表示されます(Composerウィンドウのみ)。
5. リンクボタンをクリックするか、挿入メニューからリンクを選択することで、リンクを挿入します。
6. ファイルメニューからページをブラウザで表示を選択し、作成したリンクをクリックして選択したターゲットの位置に移動してみます。

---

相対リンクと絶対リンク

リンク先のファイルのパス名をファイル名だけで指定すると、Composerはカレントディレクトリ(作業中のファイルがあるディレクトリ)からファイルを検索します。ネットワークを介した際にも同様です。 これは相対パス名と呼ばれます。相対パス名は、作業中のドキュメントとの位置関係を記述することで リンクするドキュメントを指定します。

相対パス名

パス名	意味
link.html	link.htmlは、カレントディレクトリにあるファイルです。
files/link.html	link.htmlは、filesというディレクトリ(フォルダ)にあります。 filesは、カレントディレクトリにあるディレクトリです。
docs/files/link.html	link.htmlは filesというディレクトリにあるファイルで、 filesはdocsの下にあるディレクトリです。docsはカレントディレクトリにあるディレクトリです。
../link.html	link.html は、カレントディレクトリの上のディレクトリ(フォルダ)(カレントディレクトリのあるディレクトリ) にあるファイルです。"../"を複数使って、 さらに上のディレクトリにあるファイルを指すことができます。

絶対パス名では、ディレクトリ構造のトップレベルから そのファイルまでのサブディレクトリをすべて指定してドキュメントを指します。ネットスケープサイトのような他のウェブサイトのページにリンクする場合にも、絶対パス名を使用する必要があります。

通常、自分のドキュメント内でお互いにリンクする場合は、相対パス名を使います。 リンクを絶対パス名で作成してしまうと、ファイルを他のディスクに移動したり、絶対パスのディレクトリ名やディスク名を変更したりする際に、これらのファイルへのリンクは無効になります。

絶対パス名、URL

パス名、URL	意味
/docs/test/link.html	link.html は /docs/test にあるファイルです。
/C|/docs/html/link.html	link.html は、C:ドライブの docs/html にあるファイルです。
http://netscape.com/link.html	link.html はネットスケープウェブサーバにあるファイルです。

---

出版方法と、ページ作成の応用テクニック

ここまでは、Composerを使ったウェブページオーサリングの基礎について学習してきました。いよいよ、完成したページをインターネット上の人々に見てもらう段階です。この章では、ウェブページの出版方法と、新しいスクリプト言語である、JavaScriptを使った、より進んだページ作成について学習します。

概要

ページを出版する

ワンボタンパブリッシング

File Transfer Protocol(FTP)

---

ページを出版する

ウェブページを書き終えたら、あるいはウェブプレゼンテーション全体をご使用のシステムでテストし終わったら、サーバに出版できます。今のところ、ページはまだローカルディスクに入っているのため、ウェブページをブラウザ上に表示することはできますが、他の人は未だアクセスすることができません。サーバに出版すると、ウェブページ(HTMLファイル)がウェブサーバにコピーされ、他の人にもページを見てもらえるようになります。

ウェブサーバとは?

ウェブサーバは、常に実行されているプログラムで、サーバに接続されている(Netscape Navigatorのような)ウェブクライアントからのデータ(通常はファイル)の読み込み要求を待っています。サーバとブラウザは、ウェブ上でハイパーテキストドキュメントを転送するために作られた言語であるHyperText Transfer Protocol (HTTP)を使用して通信します。ウェブサーバは、よくHTTPDサーバとも呼ばれます。

参考 :HTTPDの"D"はデーモン(daemon)をあらわしています。デーモンは、バックグラウンドで要求を待っているプログラムをあらわすUNIXの用語です。デーモンのように動作するプログラムは、必ずしもUNIXで動作させる必要はありません。ですから、どのプラットフォームであってもウェブサーバはHTTPDサーバと呼ばれます。単にHTTPサーバとも呼ばれます。

ウェブサーバの見つけかた

インターネットへのアクセスを提供している組織を利用してウェブページを出版するのが理想的です。商用のプロバイダを通じてインターネットにアクセスしている場合、そのプロバイダがウェブスペースを提供していますので利用できます。お使いのプロバイダがウェブサーバアクセスを提供しているかどうかについては、システム管理者にお問い合わせください。

ファイル名のきまり

ファイル名には、プラットフォームにより異なるきまりや制限があります。ウェブ情報を出版する際には、これについて知っておく必要があります。それは、ドキュメントがプラットフォームに依らずにできる限りポータブルである方が望ましいからです。複数のプラットフォームにまたがって作業する場合、名前付けは非常に重要なことです。

たとえば、DOSベースのシステムとファイルの移動を行う場合には、8.3のルール -- ファイル名は8文字以下で3文字の拡張子が付く -- に従う必要があります。また、Mac OSとファイルの移動を行う場合には、空白や特殊な記号を使うことはできず、ファイル名を英数字だけでしかも8文字以下にしなくてはなりません。

---

ワンボタンパブリッシング

Composerのワンボタンパブリッシング機能により、ウェブページの出版がすばやく手軽に行えます。リモートサーバにアップロード(出版)するファイルやディレクトリを選択したり、リモートサーバサイトも指定できます。

ページを出版するには、

1. ファイル メニューから出版 を選択するか、構成ツールバーの出版ボタンをクリックします。

出版ダイアログボックスが表示されます。
2. オプションを選択して、OKをクリックします。
参考 :出版するリモートサーバに、アップロードするファイル名と同じファイルがあった場合は、確認なしで上書きされます。


---

ファイルの出版ダイアログボックス

ファイルの出版ダイアログボックスの項目を使用して、リモートサーバにアップロード(出版)するファイルまたはディレクトリを指定できますし、また表題やファイル名も指定できます。ユーザ名やパスワードの設定や、リモートサーバサイトの指定もできます。

• ページの表題ボックスでは、ドキュメントがブラウザで表示される際にウィンドウの表題に表示されるテキストを入力します。ほとんどのウェブ検索ツールは表題を使ってウェブページを特定していますし、ページのブックマークにも使用されますので、訪問者が簡単にそのページを見つけることができるように、ページ内容を的確に伝えられるような意味のある表題を付けるように心がけてください。
• HTMLファイル名ボックスでは、リモートサーバにアップロードする作業中のドキュメントのファイル名を入力します。.htm または.html拡張子を加えることを忘れないでください。
• 出版先のHTTPまたはFTPの場所ボックスには、ウェブページを出版するリモートサイトの場所を入力します。このボックスに入力すべき場所については、お使いのインターネットサービスプロバイダにお問い合わせください。たとえば、お使いのサービスプロバイダが America Online の場合、このボックスのURLは次のようになります。 ftp://ftp.aol.com/docs/。ウェブサーバプロトコルを使用する場合は、次のようになります。 http://commercialweb.com/docs/。一度ここに場所を入力しておけば、次からは利用したリモートの場所を一覧から手軽に選択することができます。標準の場所を使用ボタンをクリックすると、Composerの設定ダイアログボックスの出版パネルで指定されている場所が使用されます。
• ユーザ名 ボックスには、 ウェブページを置くネットワークにアクセスする際の名前を入力します。
• パスワードボックスには、ユーザ名に対するパスワードを入力します。
• パスワードを保存をクリックすると、ウェブページを出版するたびに毎回パスワードを入力しなくてもよいように、パスワード情報を保存します。
• ページに関連するファイルをクリックすると、作業中のドキュメントで参照するファイルをすべて表示します。その後、ドキュメントと共に出版する画像ファイルを選択します。選択しないやすべて選択をクリックすると、一覧のファイルをすばやく選択したり解除したりすることができます。
• ページのフォルダ中のすべてのファイルをクリックすると、作業中のドキュメントのディレクトリ内にあるすべてのファイルを表示します。その後、ドキュメントと共に出版するファイルを選択してください。選択しないやすべて選択をクリックすると、一覧のファイルをすばやく選択したり解除したりすることができます。
参考 :出版するリモートサーバに、アップロードするファイル名と同じファイルがあった場合は、確認なしで上書きされます。

---

FTP

ウェブサーバへのファイルの転送(アップロード)にFTPを利用することもできます。Composerでは、ウェブ (HTTP)サーバへのアクセスと同じような方法で、FTPサーバにアクセスすることができます。

参考: ほとんどのFTPクライアントソフトウェアでは、ASCII転送モードとバイナリ転送モードを選べます。HTMLファイル自身は、テキストファイルとして転送できますが、JPEGやGIFファイルなど他のファイルはその方法では正しく転送できません。Composerの標準設定の場合、ファイルはFTPサイトにバイナリモードでアップロードされます。ComposerにFTPサイトの場所を示すには、場所ボックスに次のように入力します。

ftp://username@ftp.foo.com/directory1
FTPのページでは最小限の書式設定しかされていません。可能であれば、ディレクトリ内の各ファイルの種類、大きさ、日付、簡単な解説を表示します。 ディレクトリはリンクの一覧として表示されます。それぞれのリンクの先頭には、別のディレクトリやファイルを表す小さなアイコンが付けられています。ディレクトリのリンクをクリックすると、サブディレクトリが表示されます。ふつう、サブディレクトリ内の先頭の項目は、親ディレクトリを表示するためのリンクになっています。

FTPサーバにアクセスできたら、Windowsファイルマネージャーやエクスプローラからブラウザウィンドウにファイルをドラッグすることにより、ファイルをアップロードすることができます。この方法は、ウェブページのすべてのファイルがローカルディスクの1つのディレクトリに入っている場合に便利です。

---

ページデザイン

ウェブは比較的新しいものですが、コンテンツの作成時に考慮すべきいくつかの注意事項が既に存在しています。テキスト、ページの長さ、画像、配色などに関して以下のような点に注意すれば、人々の目を引き付け、魅力的で喜んで読んでもらえるようなコンテンツを作成できます。

実際に"作成する"前にまず計画を立てることが大切です。たとえば次のような点を考慮してみましょう。

• ページの目的は何ですか? サービス、製品、エンターテイメントを提供するのですか？
• 対象はどんな人たちですか? 読者層を考慮に入れることは、情報の趣旨を決定したり、首尾一貫した内容を読者へ伝えるという点でも役に立ちます。
• 情報の構成をどのようにしますか? トップレベルには索引を、その下のセカンドレベルに複数のページを配置する、という最低二つの階層で構成するのが一般的なようです。トップレベルにはできるだけたくさんの内容を入れるようにしましょう(これにより、偶然にそのページを読んだ人にでも、どんな情報なのかを素早く把握してもらうことができます)。一番簡単なレイアウトの方法は、トピックをサブトピックに分割することです。小さなトピックがいくつかある場合は、それらを一つのページにまとめると良いでしょう。
• どのくらいのリンクを入れますか? 読者はあなたのホームページへのリンクを、あるいは、ページのセットにある好きなページへのリンクを作ることもできます。また、読者はウェブページのブラウズをいろいろな場所から始めることができ、ブラウズの開始から終了まで勝手に動き回ります。どのくらいのリンクを入れるかを考慮する際には、一般的に見て適当な数かどうかテストしてみましょう。
• 画像、音、動画をどのくらい使用しますか? より派手で複雑なページは作成に時間がかかります。マルチメディア要素は確かにページを活気づけますが、ロードにとても時間がかかるため、読者が情報を得るまでの待ち時間が長くなってしまいます。

---

他のブラウザ使用者を考慮する

ウェブが有名になるにつれて、数々のブラウザが利用できるようになりました。つまり、ページの読者が、同じブラウザを使用しているとは限らないわけです。Netscape Navigatorを使用している人も、常に同じブラウザを使うとは限りません(家と職場では違うブラウザを使うかもしれません)。

一部のブラウザでしか見ることができないようなHTML機能に強く依存するドキュメントは作らないように気を付ける必要があります。Netscapeでしか使用できないHTMLタグを使う場合は、そのタグをサポートしていないブラウザでそのページを表示した場合のことを考慮する必要があります。また画像を表示できないブラウザもありますので、その画像の代わりに表示される、代わりのテキストも是非入れるようにしてください。また、Netscape Navigator(や他の多くのブラウザ)では、ページの表示方法を選択できるようになっています。フォントやフォントサイズの選択、ページの色指定、背景の無効化など、訪問者は、ウェブ作成者が指定した書式のほとんどを無視することができることも覚えておきましょう。

たとえ読者が同じブラウザを使っていたとしても、画面サイズ、色数、画面の解像度などが異なることを考える必要があります。つまり、自分の画面では素晴らしくきれいに表示されているページでも、他の人の環境ではまったく違って見えることもあるということです。これが内容を第一とするもうひとつの理由でもあります。デザインオプションは、味付けとして利用してください。

---

ページの長さを設定する

現在使われているパーソナルコンピュータのモニタの多くは、13から15インチの画面に640 x 480のピクセルを表示できます。情報を短く区切って表示するようにページをデザインすると、簡潔なページを表示させることが容易になるでしょう。

経験的に画面上で読む気になるようなページの書き方として、情報量が640 x 480の画面の2倍から3倍を超えない範囲とし、また、ページレイアウトの先頭と終わりにローカルのナビゲーションリンクを作成しておくのが良いよいでしょう。ウィンドウよりも長いページを作成した場合、読者はスクロールにより既に画面から消えてしまった情報を覚えておかなければなりません。

非常に長いウェブページにある情報を読むためには、読者がスクロールバーを使用する必要が生じるという問題点があります。スクロールバーを少し動かしただけで、画面の内容が完全に代わってしまうため、読者はどこを読んでいたのかわからなくなってしまいます。

特に、読者にテキストを印刷したり保存したりして欲しい場合、似通った情報は1ページにまとめてください。ページの操作性を向上させ、内容の印刷や保存を容易にさせたいのであれば、そのページをインライン画像も含めて2枚から3枚に印刷できる程度の大きさに分割してください。さもなければ、すべてのテキストを1ページにまとめた別のファイルへのリンクを提供してください。

---

より良いコンテンツを提供する

ページに画像を入れることは楽しいかもしれませんが、画像はそのページに付加価値を与えているにすぎません。次のガイドラインを参考にして、より良い内容にするよう心がけてください。

• 画像、色、様々なフォントサイズなどでページを装飾した場合、そのページをテキストだけで表示させて確認することを忘れないでください。また、画像の代わりに表示するテキストを必ず入れるようにしてください。
• できるだけテキストの無駄な部分を削ってください。読者は、不必要と判断したテキストを良み飛ばしてしまいますし、スクロールすることを好まないものです。ページ内のハイパーテキストリンクのテキストだけを読んで次のページに進んでしまう人さえいるほどです。
• 内容をまとめるために必要な見出しのスタイルと副題を決めてください。そのスタイルには一貫性を持たせることが大切です。Composerが提供している6レベルのヘッダーは、それらすべてを1ページ内で使うためではありません。見出しのレベルは、たとえば、最初に見出し1を一回だけ使用し、さらに必要に応じて、見出し2を幾つか使用するというように、順番に使用します。また、他のブラウザでは、同じ見出しでも間隔の取り方やフォントが異なることに注意してください。見出しのレベルは、その本来の目的である構造化のために使用するものです。
• テキスト内に、太字、斜体、複数のフォントスタイルを大量に使用することは避けてください。コンピュータの画面上で大量のテキストを読む際に、その負担を軽くするための方法として、引用文の段落の書式を使用する方法と、番号なし箇条書き書式(プロパティダイアログから利用できます)を使用する方法があります。どちらの書式でもインデントされたテキストブロックが表示され、テキストの行は短くなり、そして適切な余白が取られるため、一般にページは読み易くなります。ドキュメントのセクションを視覚的に区切る場合は、横罫線を挿入することもできます。
参照
画像を扱う
色とフォントを吟味する

---

画像を扱う

画像は、莫大な印象と情報をページに付加します。しかし画像の使い方を誤ると、読者を不快にさせたり、伝えたいメッセージが伝わらないページになってしまったりします。

実際、どのウェブ作成者も「画像は小さく！」という点で意見が一致しています。1ページに使用する画像のファイルサイズの合計は30K以下になるように努力してください。どうしても大きな画像を使う必要がある場合、ページ内には小さな画像を使用し、その画像からフルサイズの画像へのリンクを張るようにするというような配慮が必要になります。また、デザイン用プログラムを用いて不必要な色を削除することで、画像ファイルのサイズを小さくすることもできます。

背景を上手に利用してください。"派手な"背景はテキストの判読を著しく困難にします。極端に言えば、背景を使用したらメッセージを伝えようとは思わないことです。一般に、背景表示の善し悪しに気を取られてしまうと、色のコントラストが不十分になります。テキストが暗い色の場合は背景を明るくし、テキストが明るい色の場合は背景を暗くする必要があります。背景に画像を使用する場合は、テキストを読む妨げにならないよう、コントラストを下げる必要があります。

ほとんどのウェブブラウザでは、GIF (CompuServe Graphics Interchange Format、拡張子は .GIF)と、JPEG (Joint Photographic Experts Group、拡張子は .JPG)の2種類の画像フォーマットを使用することができます。JPEGフォーマットは、写真や色調が連続した画像に適しています。GIFフォーマットは、インライン画像、線画、意匠文字、画面の取り込みなどに適しています。どちらのフォーマットでも、72 dpi (dots per inch)の解像度で、RGB (red-green-blue)カラーマッピングを使用するべきです。

読者がグラフィカルなブラウザでページを見ているとは限らないため、(挿入|画像を選択して)画像のプロパティダイアログボックスの中のテキストボックスに、代わりの説明(画像の代わりに表示させるもの)を入力するようにしてください。このようにすることで、テキストベースのブラウザを使用している読者でも画像の代わりになる説明のテキストを見ることができ、また、グラフィカルなブラウザを使用している場合でも画像の読み込みに失敗した場合にそのテキストを見ることができます。

画像のダウンロード時間を短くするために役立つテクニックをいくつかご紹介します。

• ページ内ではインターレースGIFファイルを使用してください。ただし、インターレース画像をサポートしていないブラウザもありますので注意してください。それでもページ内で画像を多用している場合には考慮する価値があります。ページ内で同じ画像を複数回使用する場合、その画像ファイルへのリンクを使用すると良いでしょう。そうしないと、ブラウザはその画像が使用されるたびにそのファイルを読み込むことになります。また、画像がページを配送するウェブサーバからアクセス可能であることを確認してください。
• 画像のプロパティダイアログボックスを使用して、画像の周りの空白を(ピクセル単位で)指定してください。こうすると、クライアントに渡す画像の大きさをサーバが要求する必要がなくなるため、テキストをより高速に表示できます。画像マップとよばれる画像の拡張タイプを聞いたことがあるかもしれませんが、この画像マップは、画像内の異なる場所ごとに異なるリンクを対応付けます。画像内のある部分をクリックするとその場所に対応する特定のページが表示され、別の場所をクリックするとその場所に対応する別のページが表示されます。
参照
画像

---

色とフォントを吟味する

ページにたくさんの色をつけたり様々なフォントスタイルを使用したいという誘惑に駆られるかもしれません。しかし、そのようなページは読者に不快感を与えることが多く、伝えたいメッセージの内容が上手く伝わらなくなります。結局、読者に見て欲しいのはそのページの内容であり、そのためにはページは読み易くなければいけません。ほとんどのグラフィカルなブラウザ(Navigatorを含む)では、標準の設定でテキストの表示にはTimes Romanのようなプロポーショナルフォントを使用しています。また、多くのブラウザではその設定を変更することができるようになっています、つまり、作成したページは、読者が選択したフォントで表示されることになります。

タイポグラフィー(フォントの大きさ、書体、組付けなど)は、ページにパターンを描くための道具だと思ってください。読者が最初に見るのは表題やその他ページの細部ではなく、ページ全体のパターンやコントラストです。読者の目は、まずページを純粋に画像パターンとして捉え、その後ページの内容についての解析を始めるのです。

タイポグラフィーの良し悪しは、あるフォントとその他フォントとの視覚的なコントラストやテキスト部分とその周りの空白部分とのコントラストで決まります。見易いページを作成するのに役立つ、基本的なタイポグラフィーの原則は以下の通りです。

• テキスト内に、太字、斜体、複数のフォントスタイルを大量に使用することは避けてください。コントラストが強すぎることはコントラストが全くないのと同じくらいひどいことです。
• テキスト全体を一様に大きくすることは、そのページが大きくなるだけで全く無意味です。
• 太字フォントはすぐに単調になります。すべてを太字にした場合、目立つ場所がなくなり、読者をどなりつけているかのような効果になってしまいます。すべてを大文字で書いた場合も、同様に不快な印象を与えます。
• 内容を系統立てる2つから3つ位の見出しスタイルを選択してください。そのスタイルには一貫性を持たせてください。規則的に繰り返されるパターンは、読者が情報の場所や構成を素早く理解する手助けとなり、ページ全体の読み易さを向上させます。
• 空白をうまく利用してください。空行や横罫線を至るところに置くとページが途切れ途切れになってしまいます。(さらに、ページはできるだけ短くしなければいけません。)

よく考えられ首尾一貫した背景色の使用は、ページの演出に大いに役立ちます。一般に、大量のテキストを読むには明るいパステル調の背景が最も適しているようです。画像を大量に使用する場合、背景を黒くすると画像の見栄えがよくなり、ページに画廊のような印象を持たせることができます。タイル式の背景を使うと、その上に置かれたテキストがすべて"浮いて"見えるため、判読がかなり困難になります。背景に白を使うとテキストの見栄えが良くなりドキュメントが清潔に見えますが、大量のページを見る場合には、読者の目をかなり疲れさせる可能性があります。

---

最後の仕上げ

最後の仕上げはとても大事なことです。ケーキを特製のアイシングで飾り付けするような感じです。ここで述べることは、プロフェッショナルのウェブ作成者が仕事に太鼓判を押すようなものだと思ってください。

• ヘッダー :ウェブページの上部にある表題は、読者にそのドキュメントの要点を即座に理解させるためにあります。また、関連するグループ内の他のページとそのページの関係を知るのにも役立ちます。本の場合は順番に読むようにデザインされていますが、ウェブの場合は読者がどのような順番でページを見るかはかり知ることができません。メインの見出しの上に配置する画像は、標準的なオフィスサイズのモニタ(640 x 480ピクセル)の画面から表題がはみ出さない程度の大きさにしなければいけません。
• フッター: 理想的には、名前、所属(リンクやアイコンのような)案内表示、著作権情報、更新/変更日時などを各ページのフッターとして表示させた方が良いでしょう。
• 電子メールアドレス:素晴らしい芸術作品と同様に、ウェブページにも署名などの形式でコンタクトを取るための情報を持たせるべきです。読者がページの作成者に意見や感想を送信できるよう、電子メールフォームへのリンクを提供することができます。プロパティダイアログボックスのリンクタブを選択してください。リンク先のテキストボックスに、HTMLタグmailto: に続けて電子メールアドレスを入力してください。電子メールフォームをサポートしていないブラウザを使用している読者のために、少なくとも、名前、所属、住所を書くようにしてください。
• ナビゲーション: 読者が最初のページに戻れるよう、各ページにはトップレベルへのターゲット(戻るリンク)を入れてください。索引、目次、その他のセクション、前のページ、次のページなどへのリンクも役に立ちます。読者がターゲットの位置を常に把握できるように、これらのターゲットはページの下に配置すると良いでしょう。リンクがホームページから下へ向かってのみ流れている場合、ドキュメント内のページは行き止まりになってしまうでしょう。
• リンク :リンクを作成する際に、たとえば"ここをクリックして何かに関する情報を得てください"のような"ここをクリック"症候群に陥らないように注意してください。このようにすると、読者は他のページに移動してもどこへ行こうとしているのか覚えておかなければならなくなってしまいます。"何々に関する情報がここにあります"のような、文章中のポイントとなる部分を引用する方がより利用しやすいリンクの語句になるでしょう。同じページへのリンク項目を使用する場合、相対リンクを使うようにしてください。絶対リンク(完全なURL)を使うと、リンクが選択されるたびにブラウザがそのページの再読み込みを実行してしまいます。
• タイムスタンプ: 更新の日時と変更、または追加したページを表示してください。

---

Composer Plug-In

ネットスケープにあるPlug-Inツールを利用することでComposerに新しい機能を付け加えることができます。サンプルのPlug-Inをダウンロードするには、

1. 目的のPlug-In ZIP ファイルを選択します。
2. Plug-In ZIPファイルを適切な場所に保存します。
• Mac OSでは、Plug-insフォルダになります。Netscapeアプリケーションと同じフォルダにあります。
• UNIXでは、/usr/local/netscape/pluginsまたは、環境変数NPX_PLUGIN_PATHで指定されるディレクトリになります。
• Windowsでは、 Pluginsディレクトリになります。Navigator.exe ファイルと同じディレクトリにあります。
3. Communicator を再起動します。

新しいPlug-InがComposerウィンドウのツールメニューに表示されます。